<template>
<div ref="editor">
</div>
</template>

<script>
// import 'assets/ueditor/ueditor.config';
// import 'assets/ueditor/ueditor.all.min';
// import 'assets/ueditor/lang/zh-cn/zh-cn';
// import 'assets/ueditor/plugins/135editor.js';
const UE = require('UE');

import util from 'src/util/util/index';

export default {
    data() {
        return {
            id: util.getRandom(100000) + 'ueditorId',
        };
    },
    props: {
        value: {
            type: String,
            default: null,
        },
        config: {
            type: Object,
            default: {},
        }
    },
    methods: {
        registerMaxview() {
            let _this = this
            UE.registerUI('maxview', function(editor, uiName) {
                editor.registerCommand(uiName, {
                    execCommand: function() {
                    },
                });
                var btn = new UE.ui.Button({
                    name: uiName,
                    title: '视窗最大化',
					cssRules:`background-position: -460px -20px`,
                    onclick: function() {
                        editor.execCommand(uiName);
						editor.setHeight(window.innerHeight-150)
                    }
                });
				return btn;
            });
        },
		registerMinview() {
            let _this = this
            UE.registerUI('minview', function(editor, uiName) {
                editor.registerCommand(uiName, {
                    execCommand: function() {
                    },
                });
                var btn = new UE.ui.Button({
                    name: uiName,
                    title: '视窗最小化',
					cssRules:`background-position: -500px -20px`,
                    onclick: function() {
                        editor.execCommand(uiName);
						editor.setHeight(320)
                    }
                });
				return btn;
            });
        },
    },
    mounted() {
        let that = this;
        this.$nextTick(function f1() {
            // 保证 this.$el 已经插入文档
            that.registerMaxview()
			that.registerMinview()
            this.$refs.editor.id = this.id;
            this.editor = UE.getEditor(this.id, this.config);
            this.editor.ready(function f2() {
                this.editor.setContent(this.value);

                this.editor.addListener("contentChange", function() {
                    const wordCount = this.editor.getContentLength(true);
                    let content = this.editor.getContent();
                    const plainTxt = this.editor.getPlainTxt();
                    util.myutil(this, () => {
                        that.con = this.editor.getContent();
                        let ind = that.con.indexOf('title="正在上传..."');
                        return ind === -1;
                    }, () => {
                        content = that.con;
                        this.$emit('onchange', {
                            wordCount: wordCount,
                            content: content,
                            plainTxt: plainTxt
                        });
                    }, 0, 100, 50);

                }.bind(this));

                this.$emit('ready', this.editor);
            }.bind(this));
        });
    }

}
</script>
<style lang="less" scoped>
body {
    background-color: #ff0000;
}
</style>
